import { useNode, UserComponent } from '@craftjs/core';
import {
  CardBasicInfo,
  type CardBasicInfoProps,
} from '@jeoshi-pro/pro-rex.business.card-basic-info';
import { NodeBox } from '../../components/NodeBox';
import { Settings } from './settings';

export const CardInfo: UserComponent<CardBasicInfoProps> = ({
  children,
  ...rest
}) => {
  const { nodeId } = useNode((node) => {
    return {
      nodeId: node.id,
    };
  });

  return (
    <NodeBox id={nodeId}>
      <CardBasicInfo {...rest}>{children}</CardBasicInfo>
    </NodeBox>
  );
};

CardInfo.craft = {
  displayName: 'CardInfo',
  related: {
    settings: Settings,
  },
  defaultProps: {
    type: 'info',
    dataSource: new Array(6).fill(0).map((_, index) => [
      {
        type: 'text' as 'text',
        props: {
          label: `文本${index + 1}`,
          value: index + 1,
        },
      },
      {
        type: 'tag' as 'tag',
        props: {
          value: `文本${index + 1}`,
          color: 'warning',
        },
      },
    ]),
    tableProps: {
      columns: [
        {
          title: '姓名',
          dataIndex: 'name',
          key: 'name',
        },
        {
          title: '年龄',
          dataIndex: 'age',
          key: 'age',
        },
        {
          title: '住址',
          dataIndex: 'address',
          key: 'address',
        },
      ],
    },
  },
};
